<script setup>

import { ref,defineExpose } from "vue"
const emits = defineEmits(["update:msg"])
const props = defineProps({
  msg: {
    type: String,
    default: "primary"
  }
})
const count = ref(2)
const alert1=()=>{
  alert(1)
}
const b=()=>{
  count.value=3
}

defineExpose({
 count,
 alert1,
 b
})

const a = () => {
 emits('update:msg',"546345")
}

</script>

<template>
  <div class="mx-auto rounded-3xl a flex justify-center items-center bg-gradient-to-r from-green-400 to-blue-500">
    sadf
  </div>
  <button class=" border ">123</button>

  <el-button type="primary" @click="a">{{ props.msg }}</el-button>

  <div class="container">

    <div class="b">w34</div>
  </div>
{{count}}
</template>
<style scoped lang="scss">
.a {
  width: 100px;
  height: 40px;
}
.container{
  .b{
    background-color: aqua;
    border: 1px solid #ccc;
  }
}
</style>
